<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>MyTechBook</title>
        
    <link rel="stylesheet" type="text/css" href="../../static/css/main.css">
</head>
<body>
<div class="navbar navbar-line">
    <div class="container">
        <div class="logo">
            
                MyTechBook
            
        </div>
        <input type="checkbox" id="idoc_nav" />
        <div class="menu_tree">
        <ul><li><a href="../../index.html">首页</a></li><li><a href="#"><span></span>前沿观察</a><ul><li><a href="../../html/前沿观察/ECMAScript 6入门.html">ECMAScript 6入门</a></li><li><a href="../../html/前沿观察/Immutable详解及React中实践.html">Immutable详解及React中实践</a></li><li><a href="../../html/前沿观察/Node.js MVC框架ThinkJS.html">Node.js MVC框架ThinkJS</a></li><li><a href="../../html/前沿观察/Nodejs 5.0.0版本.html">Nodejs 5.0.0版本</a></li><li><a href="../../html/前沿观察/关系型数据库PostgreSQL.html">关系型数据库PostgreSQL</a></li><li><a href="../../html/前沿观察/轻型MVVM框架Vue.js.html">轻型MVVM框架Vue.js</a></li><li><a href="../../html/前沿观察/基于nodejs的开发框架koa.html">基于nodejs的开发框架koa</a></li></ul></li><li><a href="#"><span></span>前端工程化</a><ul><li><a href="../../html/前端工程化/前端模板.html">前端模板</a></li><li><a href="../../html/前端工程化/性能优化和前端工程的爱恨情仇.html">性能优化和前端工程的爱恨情仇</a></li><li><a href="../../html/前端工程化/webpack入门及实践.html">webpack入门及实践</a></li><li><a href="../../html/前端工程化/前端工程化不完全装逼指南.html">前端工程化不完全装逼指南</a></li></ul></li><li><a href="#"><span></span>性能优化</a><ul><li><a href="../../html/性能优化/jshint代码质量检测.html">jshint代码质量检测</a></li><li><a href="../../html/性能优化/jshint配置说明.html">jshint配置说明</a></li><li class="active"><a href="../../html/性能优化/NC性能优化.html">NC性能优化</a></li><li><a href="../../html/性能优化/React编码规范.html">React编码规范</a></li><li><a href="../../html/性能优化/性能优化待办事项.html">性能优化待办事项</a></li><li><a href="../../html/性能优化/性能优化点总结.html">性能优化点总结</a></li></ul></li><li><a href="#"><span></span>技术分享</a><ul><li><a href="../../html/技术分享/React技术分享.html">React技术分享</a></li><li><a href="../../html/技术分享/学习Git.html">学习Git</a></li><li><a href="../../html/技术分享/面向对象.html">面向对象</a></li><li><a href="../../html/技术分享/Node.js知识详解.html">Node.js知识详解</a></li><li><a href="../../html/技术分享/2015年大前端技术年终总结.html">2015年大前端技术年终总结</a></li></ul></li><li><a href="#"><span></span>随想笔记</a><ul><li><a href="../../html/随想笔记/项目技术栈规划.html">项目技术栈规划</a></li><li><a href="../../html/随想笔记/笔试面试大纲.html">笔试面试大纲</a></li></ul></li><li><a href="../../html/CONTACT.html">CONTACT</a></li></ul>    
        </div>
        
        
        <div class="forkgithub"><a target="_blank" href="https://github.com/sujunming">fork on github</a></div>
        

        <section class="idoc_nav_btn">
            <label for="idoc_nav"><span></span></label>
        </section>
    </div>
    
</div>




<div class="container">

    <div class="page-toc">
        <ul><li><a href="#t0NC性能优化进度及问题详情汇总">NC性能优化进度及问题详情汇总</a><ul><li><a href="#t1实施进度">实施进度</a></li><li><a href="#t2问题详情">问题详情</a><ul><li><a href="#t31. 文件合并">1. 文件合并</a></li><li><a href="#t42. 优化META信息">2. 优化META信息</a></li><li><a href="#t53. 在服务器端使用v_billform组件而不是客户端">3. 在服务器端使用v_billform组件而不是客户端</a></li><li><a href="#t64. autocomplate的优化">4. autocomplate的优化</a></li><li><a href="#t75. 优化大量事件绑定的问题">5. 优化大量事件绑定的问题</a></li><li><a href="#t86. 改变首屏资源的渲染方式">6. 改变首屏资源的渲染方式</a></li><li><a href="#t97. 需要精简DOM结构">7. 需要精简DOM结构</a></li><li><a href="#t108. 参照延迟加载">8. 参照延迟加载</a></li><li><a href="#t119. 资源延迟加载">9. 资源延迟加载</a></li><li><a href="#t1210. 没有设置Expires headers">10. 没有设置Expires headers</a></li><li><a href="#t1311. 未作压缩处理">11. 未作压缩处理</a></li><li><a href="#t1412. 合理放置资源">12. 合理放置资源</a></li><li><a href="#t1513. BigPipe（暂不考虑）">13. BigPipe（暂不考虑）</a></li><li><a href="#t1614. 未使用cookie-free优化（暂不考虑）">14. 未使用cookie-free优化（暂不考虑）</a></li><li><a href="#t1715. 没有使用CDN（暂不考虑）">15. 没有使用CDN（暂不考虑）</a></li></ul></li></ul></li></ul>
    </div>
    
    <div class="content markdown-body">
        <h1 id="t0NC&#x6027;&#x80FD;&#x4F18;&#x5316;&#x8FDB;&#x5EA6;&#x53CA;&#x95EE;&#x9898;&#x8BE6;&#x60C5;&#x6C47;&#x603B;">NC&#x6027;&#x80FD;&#x4F18;&#x5316;&#x8FDB;&#x5EA6;&#x53CA;&#x95EE;&#x9898;&#x8BE6;&#x60C5;&#x6C47;&#x603B; <a href="#t0NC&#x6027;&#x80FD;&#x4F18;&#x5316;&#x8FDB;&#x5EA6;&#x53CA;&#x95EE;&#x9898;&#x8BE6;&#x60C5;&#x6C47;&#x603B;"> # </a></h1>
<h2 id="t1&#x5B9E;&#x65BD;&#x8FDB;&#x5EA6;">&#x5B9E;&#x65BD;&#x8FDB;&#x5EA6; <a href="#t1&#x5B9E;&#x65BD;&#x8FDB;&#x5EA6;"> # </a></h2>
<table>
<thead>
<tr>
<th>#</th>
<th>&#x4F18;&#x5316;&#x70B9;</th>
<th>&#x8BE6;&#x7EC6;&#x63CF;&#x8FF0;</th>
<th>&#x4F18;&#x5148;&#x7EA7;</th>
<th>&#x8DDF;&#x8FDB;&#x4EBA;</th>
<th>&#x5B8C;&#x6210;&#x8FDB;&#x5EA6;</th>
<th>&#x5907;&#x6CE8;&#x8BF4;&#x660E;</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>js&#x548C;css&#x6587;&#x4EF6;&#x5408;&#x5E76;</td>
<td>&#x5177;&#x4F53;&#x63CF;&#x8FF0;&#x8BF7;&#x6D4F;&#x89C8;&#x95EE;&#x9898;&#x8BE6;&#x60C5;</td>
<td>10</td>
<td>&#x4F20;&#x5FE0;&#xFF0C;&#x738B;&#x534E;</td>
<td>50%</td>
<td></td>
</tr>
<tr>
<td>2</td>
<td>&#x4F18;&#x5316;META&#x4FE1;&#x606F;</td>
<td>&#x5177;&#x4F53;&#x63CF;&#x8FF0;&#x8BF7;&#x6D4F;&#x89C8;&#x95EE;&#x9898;&#x8BE6;&#x60C5;</td>
<td>9</td>
<td>&#x4F20;&#x5FE0;</td>
<td>&#x5F85;&#x786E;&#x8BA4;</td>
<td></td>
</tr>
<tr>
<td>3</td>
<td>v_billform&#x7EC4;&#x4EF6;&#x4F18;&#x5316;</td>
<td>&#x5177;&#x4F53;&#x63CF;&#x8FF0;&#x8BF7;&#x6D4F;&#x89C8;&#x95EE;&#x9898;&#x8BE6;&#x60C5;</td>
<td>9</td>
<td>&#x738B;&#x534E;</td>
<td>&#x6682;&#x672A;&#x5B8C;&#x6210;</td>
<td></td>
</tr>
<tr>
<td>4</td>
<td>autocomplate&#x7684;&#x4F18;&#x5316;</td>
<td>&#x5177;&#x4F53;&#x63CF;&#x8FF0;&#x8BF7;&#x6D4F;&#x89C8;&#x95EE;&#x9898;&#x8BE6;&#x60C5;</td>
<td>9</td>
<td>&#x9510;&#x950B;</td>
<td>&#x5DF2;&#x5B8C;&#x6210;</td>
<td></td>
</tr>
<tr>
<td>5</td>
<td>&#x4F18;&#x5316;&#x5927;&#x91CF;&#x4E8B;&#x4EF6;&#x7ED1;&#x5B9A;&#x7684;&#x95EE;&#x9898;</td>
<td>&#x7C7B;&#x4F3C;workflow.js &#x6709;15&#x4E2A;click &#x4E8B;&#x4EF6;&#x8FD9;&#x6837;&#x7684;&#x60C5;&#x5F62;&#x90FD;&#x9700;&#x8981;&#x4FEE;&#x590D;</td>
<td>9</td>
<td>chenylh</td>
<td>&#x5F85;&#x786E;&#x8BA4;</td>
<td></td>
</tr>
<tr>
<td>6</td>
<td>&#x6539;&#x53D8;&#x9996;&#x5C4F;&#x8D44;&#x6E90;&#x7684;&#x6E32;&#x67D3;&#x65B9;&#x5F0F;</td>
<td>&#x5C1D;&#x8BD5;&#x7531;&#x670D;&#x52A1;&#x7AEF;&#x6E32;&#x67D3;&#x9996;&#x5C4F;&#x9875;&#x9762;&#xFF0C;&#x8BA9;&#x7528;&#x6237;&#x80FD;&#x5C3D;&#x5FEB;&#x770B;&#x5230;&#x9875;&#x9762;&#x7684;&#x5448;&#x73B0;&#xFF0C;&#x4F18;&#x5316;&#x7528;&#x6237;&#x7684;&#x9996;&#x5C4F;&#x4F53;&#x9A8C;&#x3002;</td>
<td>10</td>
<td>&#x4F20;&#x5FE0;</td>
<td>&#x6682;&#x672A;&#x5B8C;&#x6210;</td>
<td></td>
</tr>
<tr>
<td>7</td>
<td>&#x7CBE;&#x7B80;DOM&#x7ED3;&#x6784;</td>
<td>&#x76EE;&#x524D;&#x9875;&#x9762;&#x5B58;&#x5728;4000+&#x4E2A;DOM&#x5143;&#x7D20;&#xFF0C;&#x9700;&#x8981;&#x7CBE;&#x7B80;</td>
<td>9</td>
<td></td>
<td>&#x672A;&#x5B8C;&#x6210;</td>
<td></td>
</tr>
<tr>
<td>8</td>
<td>&#x53C2;&#x7167;&#x5EF6;&#x8FDF;&#x52A0;&#x8F7D;</td>
<td>&#x5177;&#x4F53;&#x63CF;&#x8FF0;&#x8BF7;&#x6D4F;&#x89C8;&#x95EE;&#x9898;&#x8BE6;&#x60C5;</td>
<td>9</td>
<td>&#x5F85;&#x5B9A;</td>
<td>&#x672A;&#x5B8C;&#x6210;</td>
<td></td>
</tr>
<tr>
<td>9</td>
<td>&#x8D44;&#x6E90;&#x5EF6;&#x8FDF;&#x52A0;&#x8F7D;</td>
<td>&#x5EF6;&#x8FDF;&#x52A0;&#x8F7D;&#x975E;&#x9996;&#x5C4F;&#x7684;&#x9759;&#x6001;&#x8D44;&#x6E90;</td>
<td>9</td>
<td></td>
<td>&#x672A;&#x5B8C;&#x6210;</td>
<td></td>
</tr>
<tr>
<td>10</td>
<td>&#x8BBE;&#x7F6E;Expires headers</td>
<td>billform.controller.js&#x6587;&#x4EF6;&#x8BBE;&#x7F6E;&#x7684;&#x671F;&#x9650;&#x4E3A;<strong>(2000/1/1) </strong>&#x3001;funcnodecard.js&#x6587;&#x4EF6;&#x8BBE;&#x7F6E;&#x7684;&#x671F;&#x9650;&#x4E3A;<strong>(2000/1/1) </strong>&#x3001; favicon.ico&#x6CA1;&#x6709;&#x8BBE;&#x7F6E;<strong>(no expires) </strong></td>
<td>9</td>
<td>&#x5F85;&#x5B9A;</td>
<td>&#x672A;&#x5B8C;&#x6210;</td>
<td></td>
</tr>
<tr>
<td>11</td>
<td>&#x6587;&#x4EF6;&#x672A;&#x4F5C;&#x538B;&#x7F29;&#x5904;&#x7406;</td>
<td>&#x8FD8;&#x6709;10&#x4E2A;&#x6587;&#x4EF6;&#x672A;&#x4F5C;&#x538B;&#x7F29;&#x5904;&#x7406;</td>
<td>9</td>
<td></td>
<td>&#x672A;&#x5B8C;&#x6210;</td>
<td></td>
</tr>
<tr>
<td>12</td>
<td>&#x5408;&#x7406;&#x653E;&#x7F6E;&#x8D44;&#x6E90;</td>
<td>js&#x8D44;&#x6E90;&#x653E;&#x5728;&#x9875;&#x9762;&#x5E95;&#x90E8;</td>
<td>9</td>
<td></td>
<td>&#x672A;&#x5B8C;&#x6210;</td>
</tr>
</tbody>
</table>
<h2 id="t2&#x95EE;&#x9898;&#x8BE6;&#x60C5;">&#x95EE;&#x9898;&#x8BE6;&#x60C5; <a href="#t2&#x95EE;&#x9898;&#x8BE6;&#x60C5;"> # </a></h2>
<blockquote>
<p><strong>&#x9875;&#x9762;&#x52A0;&#x8F7D;&#x8D44;&#x6E90;&#x8BE6;&#x60C5;</strong></p>
</blockquote>
<p><img src="../..//img/nc_perform.png" alt="&#x8D44;&#x6E90;&#x63CF;&#x8FF0;"></p>
<h3 id="t31. &#x6587;&#x4EF6;&#x5408;&#x5E76;">1. &#x6587;&#x4EF6;&#x5408;&#x5E76; <a href="#t31. &#x6587;&#x4EF6;&#x5408;&#x5E76;"> # </a></h3>
<ul>
<li>&#x8FD8;&#x6709;<strong>26</strong>&#x4E2A;js&#x6587;&#x4EF6;</li>
<li>&#x8FD8;&#x6709;<strong>9</strong>&#x4E2A;css&#x6587;&#x4EF6;</li>
</ul>
<blockquote>
<p>&#x65B9;&#x6848;&#x63CF;&#x8FF0;&#xFF1A;</p>
</blockquote>
<ul>
<li><p>&#x6280;&#x672F;&#x5E73;&#x53F0;&#xFF1A;&#x5408;&#x5E76;&#x4EE5;&#x4E0B;js&#x6587;&#x4EF6;</p>
<pre><code class="lang-javascript">http:<span class="hljs-comment">//20.1.85.11:8088/uui2/libs/tangram/event.js</span>
http:<span class="hljs-comment">//20.1.85.11:8088/uui2/libs/tangram/loader.js</span>
text.js css.js
</code></pre>
</li>
<li><p>&#x5E94;&#x7528;&#x5E73;&#x53F0;&#xFF1A;&#x5408;&#x5E76;&#x4EE5;&#x4E0B;js&#x6587;&#x4EF6;</p>
<pre><code>http://20.1.85.11:8088/iwebap/js/templetutils.js
http://20.1.85.11:8088/iwebap/js/billmanagemodel.js
http://20.1.85.11:8088/iwebap/js/BillFormActionUtils.js
http://20.1.85.11:8088/iwebap/js/EventConst.js
http://20.1.85.11:8088/iwebap/js/sys/workflow/dateutil.js
http://20.1.85.11:8088/iwebap/js/sys/workflow/workflow.js
http://20.1.85.11:8088/iwebap/js/ref/ncReferComp.js
http://20.1.85.11:8088/iwebap/js/ref/refDList.js?_=1445945847436
http://20.1.85.11:8088/iwebap/js/sys/formula.js
http://20.1.85.11:8088/iwebap/js/ext/gridRender.js
http://20.1.85.11:8088/iwebap/js/billform.js
http://20.1.85.11:8088/iwebap/js/sys/webcontext.js
http://20.1.85.11:8088/iwebap/js/ext/fullgridFormatter.js
http://20.1.85.11:8088/iwebap/js/ext/billutil.js
http://20.1.85.11:8088/iwebap/js/ext/fullgridRender.js
</code></pre></li>
<li><p>&#x4E1A;&#x52A1;&#x76F8;&#x5173;&#x4EBA;&#x5458;&#xFF1A;&#x5408;&#x5E76;&#x4EE5;&#x4E0B;js&#x548C;css&#x6587;&#x4EF6;</p>
</li>
</ul>
<pre><code>// JS&#x90E8;&#x5206;
http://20.1.85.11:8088/iwebap/arap/js/commonctrl.js
http://20.1.85.11:8088/iwebap/arap/js/urlutil.js

// css&#x90E8;&#x5206;
http://20.1.85.11:8088/iwebap/css/style.css
http://20.1.85.11:8088/iwebap/css/ref/ref.css
http://20.1.85.11:8088/iwebap/page/fi/temp.css
http://20.1.85.11:8088/iwebap/css/template/billtemplateform.css
http://20.1.85.11:8088/iwebap/css/workflow/workflow.css
</code></pre><h3 id="t42. &#x4F18;&#x5316;META&#x4FE1;&#x606F;">2. &#x4F18;&#x5316;META&#x4FE1;&#x606F; <a href="#t42. &#x4F18;&#x5316;META&#x4FE1;&#x606F;"> # </a></h3>
<blockquote>
<p>&#x65B9;&#x6848;&#x63CF;&#x8FF0;&#xFF1A;</p>
</blockquote>
<pre><code>&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=utf-8&quot;&gt;
&lt;!-- &#x907F;&#x514D;IE&#x4F7F;&#x7528;&#x517C;&#x5BB9;&#x6A21;&#x5F0F; --&gt;
&lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge,chrome=1&quot;&gt;
&lt;!-- &#x542F;&#x7528;360&#x6D4F;&#x89C8;&#x5668;&#x7684;&#x6781;&#x901F;&#x6A21;&#x5F0F;(webkit) --&gt;
&lt;meta name=&quot;renderer&quot; content=&quot;webkit&quot;&gt;
&lt;!-- viewport&#x8BBE;&#x7F6E; --&gt;
&lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1&quot;&gt;
&lt;meta name=&quot;keywords&quot; content=&quot;&#x5173;&#x952E;&#x8BCD;&quot;&gt;
&lt;meta name=&quot;description&quot; content=&quot;&#x63CF;&#x8FF0;&#x5185;&#x5BB9;&quot;&gt;
&lt;!-- ios&#x5728;&#x7F51;&#x9875;&#x52A0;&#x8F7D;&#x65F6;&#x9690;&#x85CF;&#x5730;&#x5740;&#x680F;&#x4E0E;&#x5BFC;&#x822A;&#x680F;&#xFF0C;&#x5982;&#x6709;ipad&#x5C55;&#x793A;&#x53EF;&#x8003;&#x8651;&#x52A0;&#x4E0A; --&gt;
&lt;meta name=&quot;viewport&quot; content=&quot;minimal-ui&quot;&gt;
&lt;!-- &#x4EE5;&#x4E0B;&#x51E0;&#x4E2A;&#x4E3A;&#x79FB;&#x52A8;&#x7AEF;&#x7684;meta&#x4F18;&#x5316;&#xFF0C;&#x7ED3;&#x5408;&#x4E1A;&#x52A1;&#x8003;&#x8651;&#x4F7F;&#x7528; --&gt;
&lt;meta content=&quot;telephone=no&quot; name=&quot;format-detection&quot;&gt;
&lt;meta content=&quot;address=no&quot; name=&quot;format-detection&quot;&gt;
&lt;meta name=&quot;apple-mobile-web-app-status-bar-style&quot; content=&quot;black&quot;&gt;
&lt;meta name=&quot;apple-mobile-web-app-capable&quot; content=&quot;yes&quot;&gt;
&lt;!-- &#x662F;&#x5426;&#x542F;&#x52A8;webapp&#x529F;&#x80FD;&#xFF0C;&#x4F1A;&#x5220;&#x9664;&#x9ED8;&#x8BA4;&#x7684;&#x82F9;&#x679C;&#x5DE5;&#x5177;&#x680F;&#x548C;&#x83DC;&#x5355;&#x680F;&#x3002; --&gt;
&lt;meta name=&quot;apple-mobile-web-app-capable&quot; content=&quot;yes&quot; /&gt;
&lt;!-- &#x663E;&#x793A;&#x624B;&#x673A;&#x4FE1;&#x53F7;&#x3001;&#x65F6;&#x95F4;&#x3001;&#x7535;&#x6C60;&#x7684;&#x9876;&#x90E8;&#x5BFC;&#x822A;&#x680F;&#x7684;&#x989C;&#x8272;&#x3002;&#x9ED8;&#x8BA4;&#x503C;&#x4E3A;default&#xFF08;&#x767D;&#x8272;&#xFF09;&#xFF0C;&#x53EF;&#x4EE5;&#x5B9A;&#x4E3A;black&#xFF08;&#x9ED1;&#x8272;&#xFF09;&#x548C;black-translucent&#xFF08;&#x7070;&#x8272;&#x534A;&#x900F;&#x660E;&#xFF09; --&gt;
&lt;meta name=&quot;apple-mobile-web-app-status-bar-style&quot; content=&quot;black&quot; /&gt;
&lt;!-- &#x5FFD;&#x7565;&#x9875;&#x9762;&#x4E2D;&#x7684;&#x6570;&#x5B57;&#x8BC6;&#x522B;&#x4E3A;&#x7535;&#x8BDD;&#x53F7;&#x7801;&#x6216;&#x662F;&#x90AE;&#x7BB1; --&gt;
&lt;meta name=&quot;format-detection&quot; content=&quot;telphone=no, email=no&quot; /&gt;
&lt;!-- &#x9488;&#x5BF9;&#x624B;&#x6301;&#x8BBE;&#x5907;&#x4F18;&#x5316;&#xFF0C;&#x4E3B;&#x8981;&#x662F;&#x9488;&#x5BF9;&#x4E00;&#x4E9B;&#x8001;&#x7684;&#x4E0D;&#x8BC6;&#x522B;viewport&#x7684;&#x6D4F;&#x89C8;&#x5668;&#xFF0C;&#x6BD4;&#x5982;&#x9ED1;&#x8393; --&gt;
&lt;meta name=&quot;HandheldFriendly&quot; content=&quot;true&quot;&gt;
&lt;!-- &#x5FAE;&#x8F6F;&#x7684;&#x8001;&#x5F0F;&#x6D4F;&#x89C8;&#x5668; --&gt;
&lt;meta name=&quot;MobileOptimized&quot; content=&quot;320&quot;&gt;
</code></pre><h3 id="t53. &#x5728;&#x670D;&#x52A1;&#x5668;&#x7AEF;&#x4F7F;&#x7528;v_billform&#x7EC4;&#x4EF6;&#x800C;&#x4E0D;&#x662F;&#x5BA2;&#x6237;&#x7AEF;">3. &#x5728;&#x670D;&#x52A1;&#x5668;&#x7AEF;&#x4F7F;&#x7528;v_billform&#x7EC4;&#x4EF6;&#x800C;&#x4E0D;&#x662F;&#x5BA2;&#x6237;&#x7AEF; <a href="#t53. &#x5728;&#x670D;&#x52A1;&#x5668;&#x7AEF;&#x4F7F;&#x7528;v_billform&#x7EC4;&#x4EF6;&#x800C;&#x4E0D;&#x662F;&#x5BA2;&#x6237;&#x7AEF;"> # </a></h3>
<blockquote>
<p>&#x5177;&#x4F53;&#x4F18;&#x5316;&#x8BF7;&#x7ED3;&#x5408;&#x4E1A;&#x52A1;&#x529F;&#x80FD;&#x8003;&#x8651;</p>
</blockquote>
<h3 id="t64. autocomplate&#x7684;&#x4F18;&#x5316;">4. autocomplate&#x7684;&#x4F18;&#x5316; <a href="#t64. autocomplate&#x7684;&#x4F18;&#x5316;"> # </a></h3>
<p>&#x4ECE;DOM&#x6811;&#x4E0A;&#x770B;&#xFF0C;&#x521B;&#x5EFA;&#x4E86;&#x5927;&#x91CF;&#x7684;&#x4EE5;&#x4E0B;DOM&#x5143;&#x7D20;</p>
<pre><code class="lang-html"><span class="hljs-tag">&lt;<span class="hljs-title">div</span> <span class="hljs-attribute">class</span>=<span class="hljs-value">&quot;ac_results&quot;</span> <span class="hljs-attribute">style</span>=<span class="hljs-value">&quot;display: none; position: absolute; width: 180px;&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-title">div</span>&gt;</span>
</code></pre>
<h3 id="t75. &#x4F18;&#x5316;&#x5927;&#x91CF;&#x4E8B;&#x4EF6;&#x7ED1;&#x5B9A;&#x7684;&#x95EE;&#x9898;">5. &#x4F18;&#x5316;&#x5927;&#x91CF;&#x4E8B;&#x4EF6;&#x7ED1;&#x5B9A;&#x7684;&#x95EE;&#x9898; <a href="#t75. &#x4F18;&#x5316;&#x5927;&#x91CF;&#x4E8B;&#x4EF6;&#x7ED1;&#x5B9A;&#x7684;&#x95EE;&#x9898;"> # </a></h3>
<p>&#x76EE;&#x524D;&#x5355;&#x5C31;workflow.js&#x6587;&#x4EF6;&#x67D0;&#x4E2A;DOM&#x4E0A;&#x5C31;&#x53D1;&#x73B0;&#x7ED1;&#x5B9A;&#x4E86;&#x6709;15&#x4E2A;click &#x4E8B;&#x4EF6;&#xFF0C;&#x9700;&#x8981;&#x7740;&#x91CD;&#x6392;&#x67E5;&#x7C7B;&#x4F3C;&#x7684;&#x7ED9;DOM&#x7ED1;&#x5B9A;&#x5927;&#x91CF;&#x4E8B;&#x4EF6;&#x7684;&#x60C5;&#x51B5;</p>
<h3 id="t86. &#x6539;&#x53D8;&#x9996;&#x5C4F;&#x8D44;&#x6E90;&#x7684;&#x6E32;&#x67D3;&#x65B9;&#x5F0F;">6. &#x6539;&#x53D8;&#x9996;&#x5C4F;&#x8D44;&#x6E90;&#x7684;&#x6E32;&#x67D3;&#x65B9;&#x5F0F; <a href="#t86. &#x6539;&#x53D8;&#x9996;&#x5C4F;&#x8D44;&#x6E90;&#x7684;&#x6E32;&#x67D3;&#x65B9;&#x5F0F;"> # </a></h3>
<p>&#x5C31;&#x4ED8;&#x6B3E;&#x5355;&#x9875;&#x9762;&#x5206;&#x6790;&#xFF0C;&#x7531;&#x4E8E;&#x4F7F;&#x7528;requirejs&#x5C06;&#x9875;&#x9762;&#x7684;&#x4E3B;&#x4F53;&#x90E8;&#x5206;&#x5F02;&#x6B65;&#x7684;&#x6E32;&#x67D3;&#x51FA;&#x6765;&#xFF0C;&#x5BFC;&#x81F4;&#x8BBF;&#x95EE;&#x9875;&#x9762;&#x7684;&#x9996;&#x5C4F;&#x52A0;&#x8F7D;&#x65F6;&#x95F4;&#x8F83;&#x957F;</p>
<blockquote>
<p>&#x5EFA;&#x8BAE;&#x5C1D;&#x8BD5;&#x7531;&#x670D;&#x52A1;&#x7AEF;&#x6E32;&#x67D3;&#x9996;&#x5C4F;&#x9875;&#x9762;&#xFF0C;&#x8BA9;&#x7528;&#x6237;&#x80FD;&#x5C3D;&#x5FEB;&#x770B;&#x5230;&#x9875;&#x9762;&#x7684;&#x5448;&#x73B0;&#xFF0C;&#x4F18;&#x5316;&#x7528;&#x6237;&#x7684;&#x9996;&#x5C4F;&#x4F53;&#x9A8C;&#x3002;</p>
</blockquote>
<h3 id="t97. &#x9700;&#x8981;&#x7CBE;&#x7B80;DOM&#x7ED3;&#x6784;">7. &#x9700;&#x8981;&#x7CBE;&#x7B80;DOM&#x7ED3;&#x6784; <a href="#t97. &#x9700;&#x8981;&#x7CBE;&#x7B80;DOM&#x7ED3;&#x6784;"> # </a></h3>
<blockquote>
<p>&#x9875;&#x9762;&#x8D85;&#x8FC7;4000+&#x7684;DOM&#x5143;&#x7D20;</p>
</blockquote>
<p>&#x76EE;&#x524D;&#x9875;&#x9762;&#x4E2D;&#x5B58;&#x5728;&#x5927;&#x91CF;&#x7684;&#x5197;&#x4F59;DOM&#x7ED3;&#x6784;&#xFF0C;&#x9700;&#x8981;&#x5408;&#x7406;&#x5E03;&#x5C40;&#xFF0C;&#x51CF;&#x5C11;DOM&#x6570;&#x91CF;</p>
<p><img src="../..//img/dom.png" alt=""></p>
<h3 id="t108. &#x53C2;&#x7167;&#x5EF6;&#x8FDF;&#x52A0;&#x8F7D;">8. &#x53C2;&#x7167;&#x5EF6;&#x8FDF;&#x52A0;&#x8F7D; <a href="#t108. &#x53C2;&#x7167;&#x5EF6;&#x8FDF;&#x52A0;&#x8F7D;"> # </a></h3>
<p><img src="../..//img/modal.png" alt=""></p>
<h3 id="t119. &#x8D44;&#x6E90;&#x5EF6;&#x8FDF;&#x52A0;&#x8F7D;">9. &#x8D44;&#x6E90;&#x5EF6;&#x8FDF;&#x52A0;&#x8F7D; <a href="#t119. &#x8D44;&#x6E90;&#x5EF6;&#x8FDF;&#x52A0;&#x8F7D;"> # </a></h3>
<p>RequireJS &#x4ECE; 2.0 &#x5F00;&#x59CB;&#xFF0C;&#x4E5F;&#x6539;&#x6210;&#x53EF;&#x4EE5;&#x5EF6;&#x8FDF;&#x6267;&#x884C;</p>
<pre><code>if (!&apos;webkitFilter&apos; in document.createElement(&apos;div&apos;).style ) {
    require.async(&apos;test&apos;,function(test){
      console.log(test.fuck);
    })
  }
</code></pre><h3 id="t1210. &#x6CA1;&#x6709;&#x8BBE;&#x7F6E;Expires headers">10. &#x6CA1;&#x6709;&#x8BBE;&#x7F6E;Expires headers <a href="#t1210. &#x6CA1;&#x6709;&#x8BBE;&#x7F6E;Expires headers"> # </a></h3>
<blockquote>
<p>Expires headers &#x544A;&#x8BC9;&#x6D4F;&#x89C8;&#x5668;&#x662F;&#x5426;&#x5E94;&#x8BE5;&#x4ECE;&#x670D;&#x52A1;&#x5668;&#x8BF7;&#x6C42;&#x4E00;&#x4E2A;&#x7279;&#x5B9A;&#x7684;&#x6587;&#x4EF6;&#x6216;&#x8005;&#x662F;&#x5426;&#x5E94;&#x8BE5;&#x4ECE;&#x6D4F;&#x89C8;&#x5668;&#x7684;&#x7F13;&#x5B58;&#x6293;&#x4F4F;&#x5B83;&#x3002;Expires headers &#x7684;&#x8BBE;&#x8BA1;&#x76EE;&#x7684;&#x662F;&#x5E0C;&#x671B;&#x4F7F;&#x7528;&#x7F13;&#x5B58;&#x6765;&#x51CF;&#x5C11;HTTP requests&#x7684;&#x6570;&#x91CF;&#xFF0C;&#x4ECE;&#x800C;&#x51CF;&#x5C11;HTTP&#x76F8;&#x5E94;&#x7684;&#x5927;&#x5C0F;&#x3002;</p>
</blockquote>
<ul>
<li><a href="http://localhost/iwebap/pages/20080EBR/billform.controller.js&#x6587;&#x4EF6;&#x8BBE;&#x7F6E;&#x7684;&#x671F;&#x9650;&#x4E3A;">http://localhost/iwebap/pages/20080EBR/billform.controller.js&#x6587;&#x4EF6;&#x8BBE;&#x7F6E;&#x7684;&#x671F;&#x9650;&#x4E3A;</a> <strong>(2000/1/1) </strong></li>
<li><a href="http://localhost/.../funcnodecard.js&#x6587;&#x4EF6;&#x8BBE;&#x7F6E;&#x7684;&#x671F;&#x9650;&#x4E3A;">http://localhost/.../funcnodecard.js&#x6587;&#x4EF6;&#x8BBE;&#x7F6E;&#x7684;&#x671F;&#x9650;&#x4E3A;</a> <strong>(2000/1/1) </strong></li>
<li><a href="http://localhost/favicon.ico&#x6CA1;&#x6709;&#x8BBE;&#x7F6E;">http://localhost/favicon.ico&#x6CA1;&#x6709;&#x8BBE;&#x7F6E;</a> <strong>(no expires) </strong></li>
</ul>
<h3 id="t1311. &#x672A;&#x4F5C;&#x538B;&#x7F29;&#x5904;&#x7406;">11. &#x672A;&#x4F5C;&#x538B;&#x7F29;&#x5904;&#x7406; <a href="#t1311. &#x672A;&#x4F5C;&#x538B;&#x7F29;&#x5904;&#x7406;"> # </a></h3>
<pre><code>http://localhost/iwebap/css/workflow/workflow.css
http://localhost/uui2/libs/knockout/knockout-3.2.0.debug.js
http://localhost/iwebap/arap/js/urlutil.js
http://localhost/uui2/libs/i18next/i18next.js
http://localhost/iwebap/trd/bootstrap-table/src/bootstrap-table.js
http://localhost/iwebap/js/ref/jquery.scrollbar.js
http://localhost/iwebap/js/ref/refer.js
http://localhost/uui2/libs/uui/js/u.js
http://localhost/iwebap/js/sys/workflow/dateutil.js
</code></pre><h3 id="t1412. &#x5408;&#x7406;&#x653E;&#x7F6E;&#x8D44;&#x6E90;">12. &#x5408;&#x7406;&#x653E;&#x7F6E;&#x8D44;&#x6E90; <a href="#t1412. &#x5408;&#x7406;&#x653E;&#x7F6E;&#x8D44;&#x6E90;"> # </a></h3>
<blockquote>
<p>&#x95EE;&#x9898;&#x63CF;&#x8FF0;&#xFF1A;&#x76EE;&#x524D;JS&#x6587;&#x4EF6;&#x5168;&#x90E8;&#x653E;&#x5728;head&#x6807;&#x7B7E;&#x5185;&#xFF0C;&#x5E94;&#x5C06;js&#x6587;&#x4EF6;&#x653E;&#x5728;&#x5E95;&#x90E8;&#x52A0;&#x8F7D;&#xFF0C;css&#x6587;&#x4EF6;&#x653E;&#x5728;&#x5934;&#x90E8;&#x52A0;&#x8F7D;</p>
</blockquote>
<p><img src="../..//img/js.png" alt=""></p>
<h3 id="t1513. BigPipe&#xFF08;&#x6682;&#x4E0D;&#x8003;&#x8651;&#xFF09;">13. BigPipe&#xFF08;&#x6682;&#x4E0D;&#x8003;&#x8651;&#xFF09; <a href="#t1513. BigPipe&#xFF08;&#x6682;&#x4E0D;&#x8003;&#x8651;&#xFF09;"> # </a></h3>
<blockquote>
<p>&#x5206;&#x5757;&#x52A0;&#x8F7D;&#x7684;&#x65B9;&#x6848;&#xFF0C;&#x9700;&#x8981;&#x7ED3;&#x5408;&#x4E1A;&#x52A1;&#x573A;&#x666F;&#x4F7F;&#x7528;&#x3002;</p>
</blockquote>
<h3 id="t1614. &#x672A;&#x4F7F;&#x7528;cookie-free&#x4F18;&#x5316;&#xFF08;&#x6682;&#x4E0D;&#x8003;&#x8651;&#xFF09;">14. &#x672A;&#x4F7F;&#x7528;cookie-free&#x4F18;&#x5316;&#xFF08;&#x6682;&#x4E0D;&#x8003;&#x8651;&#xFF09; <a href="#t1614. &#x672A;&#x4F7F;&#x7528;cookie-free&#x4F18;&#x5316;&#xFF08;&#x6682;&#x4E0D;&#x8003;&#x8651;&#xFF09;"> # </a></h3>
<p>&#x5DE5;&#x4F5C;&#x539F;&#x7406;&#x8BF4;&#x660E;&#xFF1A;</p>
<p>&#x5F53;&#x7528;&#x6237;&#x6D4F;&#x89C8;&#x5668;&#x53D1;&#x9001;&#x4E00;&#x4E2A;&#x9759;&#x6001;&#x6587;&#x4EF6;&#xFF0C;&#x5982;&#x56FE;&#x7247;image&#x3001;CSS&#x6837;&#x5F0F;&#x8868;&#x6587;&#x4EF6;&#x65F6;&#x4F1A;&#x540C;&#x65F6;&#x53D1;&#x9001;&#x540C;&#x4E00;&#x4E2A;&#x57DF;&#x540D;&#xFF08;&#x6216;&#x4E8C;&#x7EA7;&#x57DF;&#x540D;&#xFF09;&#x4E0B;&#x7684;cookies&#xFF0C;&#x4F46;&#x662F;&#x7F51;&#x7AD9;&#x670D;&#x52A1;&#x5668;&#x5BF9;&#x53D1;&#x9001;&#x8FC7;&#x6765;&#x7684;cookies&#x5B8C;&#x5168;&#x4E0D;&#x4E88;&#x7406;&#x4F1A;&#xFF0C;<code>&#x56E0;&#x6B64;&#x8FD9;&#x4E9B;&#x6CA1;&#x7528;&#x7684;cookies&#x767D;&#x767D;&#x6D6A;&#x8D39;&#x4E86;&#x7F51;&#x7AD9;&#x5E26;&#x5BBD;&#xFF0C;&#x5F71;&#x54CD;&#x7F51;&#x7AD9;&#x52A0;&#x8F7D;&#x901F;&#x5EA6;&#x548C;&#x7F51;&#x9875;&#x6027;&#x80FD;&#x8868;&#x73B0;&#x3002;</code></p>
<p>&#x6240;&#x4EE5;&#x53EF;&#x4EE5;&#x8BBE;&#x7F6E;cookie-free domains&#x6765;&#x89E3;&#x51B3;&#x8FD9;&#x4E2A;&#x95EE;&#x9898;&#x3002;<code>&#x65B9;&#x6CD5;&#x5C31;&#x662F;&#x5728;&#x6D4F;&#x89C8;&#x5668;&#x53D1;&#x9001;&#x9759;&#x6001;&#x5185;&#x5BB9;&#x7684;&#x8BF7;&#x6C42;&#x65F6;&#x4E0D;&#x4F1A;&#x53D1;&#x9001;cookies &#x7684;&#x57DF;&#x540D;&#xFF0C;&#x4E00;&#x822C;&#x4F1A;&#x6CE8;&#x518C;&#x4E00;&#x4E2A;&#x4E8C;&#x7EA7;&#x57DF;&#x540D;&#x4E13;&#x95E8;&#x7528;&#x6765;&#x50A8;&#x5B58;&#x8FD9;&#x4E9B;&#x9759;&#x6001;&#x56FE;&#x7247;&#x3001;JS&#x3001;&#x9759;&#x6001;CSS&#x6587;&#x4EF6;&#x3002;</code></p>
<h3 id="t1715. &#x6CA1;&#x6709;&#x4F7F;&#x7528;CDN&#xFF08;&#x6682;&#x4E0D;&#x8003;&#x8651;&#xFF09;">15. &#x6CA1;&#x6709;&#x4F7F;&#x7528;CDN&#xFF08;&#x6682;&#x4E0D;&#x8003;&#x8651;&#xFF09; <a href="#t1715. &#x6CA1;&#x6709;&#x4F7F;&#x7528;CDN&#xFF08;&#x6682;&#x4E0D;&#x8003;&#x8651;&#xFF09;"> # </a></h3>
<p>&#x9759;&#x6001;&#x8D44;&#x6E90;44&#x4E2A;&#xFF0C;&#x90FD;&#x6CA1;&#x6709;&#x8D70;CDN</p>

        <div class="copyright">Powered by <a href="https://github.com/jaywcjlove/idoc" target="_blank">idoc</a>. Dependence <a href="https://nodejs.org">Node.js</a> run.</div>
    </div>

</div>


</body>
</html>
